import QtQuick 2.4
import QtQuick.Controls 2.14
import QtGraphicalEffects 1.12

Page {
    id: page
    width: 400
    height: 400

    header: Label {
        text: qsTr("Sample Widget")
        font.pixelSize: Qt.application.font.pixelSize * 2
        padding: 10
    }
    Rectangle {
        id:rect1
        x:0
        y:0
        width:338
        height:24
        color: "#e1ffc8"
        Label {
            text: qsTr("x=0,y=0,width=50,height=60")
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.verticalCenter: parent.verticalCenter
            font.pixelSize: Qt.application.font.pixelSize
        }
    }

    ToolButton {
        id:button
        width: 157
        height: 51
        x: 51
        y: 54
        background: Rectangle{
            border.width: 1
            radius: 3
            color:"white"
            border.color: "#BABABA"
        }
        layer.enabled: button.hovered
        layer.effect: DropShadow {
            anchors.fill: button
            radius: 20
            spread:0.1
            samples: 41
            color: "#BABABA"
            source: button
        }

        Label {
            x: -7
            y: 4
            text: qsTr("DropShadow效果, Layer")
            font.pixelSize: Qt.application.font.pixelSize
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.verticalCenter: parent.verticalCenter
        }
    }

    Rectangle {
        id:rect2
        width: 124
        height: 67
        x: 251
        y: 54
        border.width: 1
        radius: 3
        border.color: "#BABABA"
        DropShadow {
            anchors.fill: rect2
            radius: 20
            spread:0.1
            samples: 41
            color: "black"
            source: rect2
        }

        Label {
            x: -7
            y: 4
            text: qsTr("DropShadow 效果")
            font.pixelSize: Qt.application.font.pixelSize
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.verticalCenter: parent.verticalCenter
        }
    }
    footer: Rectangle{
        height:35
        color: "grey"
        Label {
            text: qsTr("Footer")
            font.pixelSize: Qt.application.font.pixelSize
        }
    }
}
